<template>
  <h1>El-开关组件</h1>
  <el-switch v-model="value1" />
  <el-switch
      v-model="value2"
      class="ml-2"
      style="--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949"
  />
  <br>
  <el-switch v-model="isShow"/><br>
  <img src="fcq.jpg" v-if="isShow" width="150"/>
  <br>
  <el-switch v-model="isShowStr" active-text="1" inactive-text="0"/>
<!--  当 num 是数字类型，就需要进行属性绑定，否则会被看成是字符串，无法生效-->
  <el-switch v-model="isShowStr" :active-text="'1'" :inactive-text="'0'"/>

</template>
<script setup>
  import { ref } from 'vue'

  const value1 = ref(true)
  const value2 = ref(false)
  const isShow = ref(false)
  const isShowStr = ref(0)
</script>


<style scoped>

</style>